var _inherit = require('core/inherit.js');
var _Container = require('component/container.js');
var _vec3f = require('core/glm.js').vec3f;
var _global = require('global/global.js');
var _layout = require('tools/layout.js');
var _relative = _layout.relative;

var S = require('res/style.js');
var R = require('res/texture.js').R;
var _Cell = require('scenes/game/cell.js');

var _Constant = require('scenes/game/constant.js');
var _Utility = require('scenes/utility.js');

var ROW_COUNT = 4;
var COL_COUNT = 4;
var CELLS_COUNT = ROW_COUNT * COL_COUNT;
var UNIT_WIDTH = _Constant.recordSlot[0];
var UNIT_HEIGHT = _Constant.recordSlot[1];

var _Constance = require('./constance.js');

function createInnerBg() {
    var width = _Constant.recordSlot[0] * 4;
    var height = _Constant.recordSlot[1] * 4;

    var mh = 10;
    var mv = 10;
    var bg = _global.ninePatchNode(R.dialog.text_bg, 'all', 10, 20, 10, 10);
    bg.setSize(width + 2 * mh, height + 2 * mh);
    bg.setPosition(-mh, -mv)

    return bg;
}

function createOuterBg(w, h) {
    var bg = _global.ninePatchNode(R.dialog.bg, 'all', 15, 15, 15, 15);
    bg.setSize(w, h);
    return bg;
}

// ==========================
// Slot
// ==========================
function Slot(index, count) {
    _Container.call(this);
    this.mIndex = index;
    this.mCount = count;

    this.mReuseText = _Constance.getLocal().find('instance.reuse_score');
    this.mRefer = this.mReuseText.getRefer(count);
    this.mSkin = this.mReuseText.getSkinRefer(count);

    var col = index % COL_COUNT;
    var row = (index - col) / COL_COUNT;
    this.setPosition(new _vec3f((col + 0.5) * UNIT_WIDTH, (ROW_COUNT - row - 0.5) * UNIT_HEIGHT));
}
_inherit(Slot, _Container);
Slot.prototype.getCount = function () {
    return this.mCount;
};
Slot.prototype.drawContent = function (context) {
    this.mReuseText.drawRefer(this.mSkin, this.mRefer, context);
};

// ==========================
// CellView
// ==========================
function CellView(data) {
    _Container.call(this);
    this.addChild(createInnerBg());
    for (var i = 0; i < CELLS_COUNT; i++) {
        this.addChild(new Slot(i, data[i] || 1));
    }
    this.setSize(_Constant.recordSlot[0] * 4, _Constant.recordSlot[1] * 4);
}
_inherit(CellView, _Container);
CellView.prototype.mTag = 'Menu.CellView';

// ==========================
// Record
// ==========================
/**
 * @param record {score, cells}
 * @constructor
 */
function Record(record) {
    _Container.call(this);

    this.addChild(this.mBg = createOuterBg(360, 390));
    this.addChild(this.mCells = new CellView(record.getCells()));
    if (record.isFresh()) {
        this.addChild(this.mName = S.menu.record.name_fresh.createText(record.getName()));
    } else {
        this.addChild(this.mName = S.menu.record.name.createText(record.getName()));
    }
    this.addChild(this.mTotal = S.menu.record.total.createText(_Utility.numberFormat(record.getScore())));
    this.mName.setAnchor(0.5, 1);

    this.setSize(360, 490);
    this.setAnchor(0.5, 0.5);
    this.setAnchor(0.5, 1);
    this.layout();
}
_inherit(Record, _Container);
Record.prototype.layout = function () {
    _relative.local.layoutTo(this.mBg, 0.5, 1, this, 0.5, 1);
    _relative.local.layoutTo(this.mCells, 0.5, 1, this, 0.5, 1, 0, -20);
    _relative.layoutTo(this.mName, 0.5, 1, this.mCells, 0.5, 0, 0, -5);
    _relative.local.layoutTo(this.mTotal, 0.5, 0, this, 0.5, 0);
};
Record.prototype.layoutVertical = function (h) {
    var offset = 0;
    if (h > 800) {
        offset = (h - 800) * 0.2;
    }
    this.mPosition[1] = h - 163 - offset;
    this.touchMatrix();
};

module.exports = Record;